<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

    <script type="text/javascript">
    $(function() {
    	$("input[name=startDay]").datepicker();
    	$("input[name=endDay]").datepicker();
    	$("input[name=date]").datepicker();
    	
//    	$("input[name=radioSearchForDay]").click(function() {
//            if ( $("input[name=radioSearchForDay]:checked").val() == "기간" ) {
//                $("input[name=startDay]").attr("disabled", false);
//                $("input[name=endDay]").attr("disabled", false);
//            } else {
//            	$("input[name=startDay]").attr("disabled", true);
//                $("input[name=endDay]").attr("disabled", true);
//            }
//        });
    });
    
    function dayBtn() {
    	$("#timeSearch").css("display", "none");
    	$("#daySearch").css("display", "block");
    	$("#forDayButton").css("background", "#333333");
    	$("#forTimeButton").css("background", "#999999");
    }
    
    function timeBtn() {
    	$("#timeSearch").css("display", "block");
        $("#daySearch").css("display", "none");
        $("#forTimeButton").css("background", "#333333");
        $("#forDayButton").css("background", "#999999");
    }
    
    function daySearchBtn() {
    	$.ajax({
    		type: "post",
    		url: "./loginReportDaySearch.ga",
    		data: {
    			searchType: $("input[name=radioSearchForDay]:checked").val()
    		},
    		success: function(data) {
    			$("#result").html(data);
    		},
    		error: function() {
    			alert("오류");
    		}
    	});
    }
    
    function timeSearchBtn() {
    	$.ajax({
    		type: "post",
    		url: "./loginReportTimeSearch.ga",
    		data: {
    			date: $("input[name=date]").val()
    		},
    		success: function(data) {
    			$("#result").html(data);
    		},
    		error: function() {
    			alert("오류");
    		}
    	});
    }
    </script>

</head>
<body>

<h2 style="float:left;">접속자 수 현황</h2>
<br/>
<table align="right">
    <tr>
        <td><input type="button" value="엑셀저장"/></td>
        <td><input type="button" value="인쇄하기"/></td>
    </tr>
</table>
<br style="clear:both;"/>

<div style="float:none;">
    <div class="tabButton" id="forDayButton" style="background:#333333;" onclick="dayBtn()">날짜별</div>
    <div class="tabButton" id="forTimeButton" style="background:#999999;" onclick="timeBtn()">시간대별</div>
</div>

<div id="daySearch" style="background:#eeeeee;clear:both;line-height:50px;height:60px;">
    <table cellspacing="0" cellpadding="4" align="center" style="text-align:center;font-size:11pt;width:100%;">
        <tr>
            <td width="7%"><input type="radio" name="radioSearchForDay" value="당일" checked/> 당일</td>
            <td width="7%"><input type="radio" name="radioSearchForDay" value="당월"/> 당월</td>
            <td width="7%"><input type="radio" name="radioSearchForDay" value="전일"/> 전일</td>
            <td width="7%"><input type="radio" name="radioSearchForDay" value="전월"/> 전월</td>
            <td width="13%"><input type="radio" name="radioSearchForDay" value="기간"/> 기간별 검색</td>
            <td width="20%">Start <input type="text" name="startDay" style="cursor:pointer;" disabled readOnly/></td>
            <td width="20%">End <input type="text" name="endDay" style="cursor:pointer;" disabled readOnly/></td>
            <td align="right"><input type="button" id="daySearchBtn" value="검색" style="width:100px;height:30px;" onclick="daySearchBtn()"/></td>
        </tr>
    </table>
</div>
<div id="timeSearch" style="display:none;background:#eeeeee;clear:both;line-height:50px;height:60px;">
    <table cellspacing="0" cellpadding="4" align="center" style="text-align:center;font-size:11pt;width:100%;">
        <tr>
            <td width="20%">날짜 <input type="text" name="date" style="cursor:pointer;" readOnly/></td>
            <td align="right"><input type="button" id="timeSearchBtn" value="검색" style="width:100px;height:30px;" onclick="timeSearchBtn()"/></td>
        </tr>
    </table>
</div>

<!-- 검색 데이터 -->
<div id="result"></div>

</body>
</html>